<template>
  <div class="hello">
    father:
    <input type="text" v-model="name">
    <br>
    <br>
    <!-- 引入子组件 -->
    <child :inputName="name"></child>
    <child2 v-on:childByValue="childByValue"></child2>
  </div>
</template>

<script>
import child from '../child/child'
import child2 from '../child2/child2'
export default {
  name: "HelloWorld",
  components:{
    'child':child,
    'child2' :child2
  },
  data() {
    return {
      name:''
    };
  },
  methods: {
    childByValue: function(childValue){
      this.name = childValue
    }
  },
  mounted() {
   
  },
  watch: {
    
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
